<ion-header translucent>
  <ion-toolbar>
    <ion-title>Payment Schedule</ion-title>
    <ion-buttons slot="end">
      <ion-button (click)="dismissModal()">
        <svg class="icon" aria-hidden="true">
          <use xlink:href="#iconclose1"></use>
        </svg>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content fullscreen>
  <div>
    <div class="title item_color">
      <div class="ion-padding-horizontal title_box">
        <div class="ion-float-left f_weight">
          Request Amount
        </div>
        <div class="ion-float-right f_weight">
          $ 5,000.00
        </div>
      </div>
    </div>
    <div>
      <ion-grid>
        <ion-row class="ion-padding-vertical" *ngFor="let item of initDatas">
          <ion-col size="12" class="item_color col_radius row_selected clean_padding">
            <ion-grid class="clean_padding">
              <ion-row>
                <ion-col size="2" class="box_center ">
                  <div class="border_right f_weight">
                    <div class="ion-text-center">
                      <ion-text color="">
                       {{item.periods}}
                      </ion-text>
                    </div>
                    <div class="ion-text-center">
                      <ion-text color="">
                        Periods
                      </ion-text>
                    </div>
                  </div>
                </ion-col>
                <ion-col size="10">
                  <ion-grid>
                    <ion-row>
                      <ion-col size="6" class="ion-text-left">
                        <ion-text color="">
                          Principal /
                          <span> Monthly </span>
                        </ion-text>
                      </ion-col>
                      <ion-col size="6" class="ion-text-right f_weight">
                        <ion-text color="">
                          $ {{item.maxAMt}}
                        </ion-text>
                      </ion-col>
                    </ion-row>
                    <ion-row>
                      <ion-col size="6" class="ion-text-left">
                        <ion-text color="">
                          Fee /
                          <span> Monthly </span>
                        </ion-text>
                      </ion-col>
                      <ion-col size="6" class="ion-text-right">
                        <ion-text color="">
                          <span>
                            $ {{item.minAMt}}
                          </span>
                        </ion-text>
                      </ion-col>
                    </ion-row>
                  </ion-grid>
                </ion-col>
              </ion-row>
            </ion-grid>
          </ion-col>
        </ion-row>
        
      </ion-grid>
    </div>
  </div>

</ion-content>